<template>
 <el-tabs type="border-card" >
  <el-tab-pane label="聊天室列表">
    <template >
            <el-table :data="RoomList" height="450" style="width: 100%" border stripe>
              <el-table-column type="index" > </el-table-column>
              <el-table-column prop="name" label="聊天室名" width="180"></el-table-column>
              <el-table-column prop="id" label="聊天室ID" width="180"></el-table-column>
              <el-table-column prop="createTime" label="创建时间" > </el-table-column>
                <el-table-column prop="creatorId" label="创建人ID" width="180"> </el-table-column>
            </el-table>
    </template>
  </el-tab-pane>
  <el-tab-pane label="好友列表">
    <template>
        <el-table :data="FriendList" height="450" style="width: 100%" border stripe>
              <el-table-column type="index" > </el-table-column>
              <el-table-column prop="name" label="昵称" width="180"></el-table-column>
              <el-table-column prop="id" label="用户ID" width="180"></el-table-column>
              <el-table-column label="地区">
                <el-table-column prop="country" label="国家"> </el-table-column>
                <el-table-column prop="province" label="省份"> </el-table-column>
                <el-table-column prop="city" label="市区" > </el-table-column>
            </el-table-column>
    </el-table>    
  </template>
  </el-tab-pane>
  </el-tabs>
    
</template>
<script>
import {getFriendList,getRoomList} from '../../util/api.js'
export default {
    data(){
        return{
             userId:'',
             FriendList:[],
             RoomList:[],
             avatar:'',
             name:''
        }
    },
    created()
    {
        this.token= window.sessionStorage.getItem('token')
        console.log( this.$route.query.userId)
        this.userId= this.$route.query.userId
        this.getFriend()
        this.getRoom()

    },
    methods:{
    
        async getFriend(){
          const result =await this.$http.post(getFriendList,
          {
            'token':this.token,
            'userId':this.userId
          }
          );
            console.log(result.data)
            if(result.status!==200) return this.$message.console.error("获取数据失败！");
           this.FriendList=result.data.list
            this.$message.success("获取数据成功")        
      },
      async getRoom(){
          const result =await this.$http.post(getRoomList,
          {
            'token':this.token,
            'userId':this.userId
          }
          );
            console.log(result.data)
            if(result.status!==200) return this.$message.console.error("获取数据失败！");
           this.RoomList=result.data.list
            this.$message.success("获取数据成功")        
      }

    }
}
</script>
<style lang="less" scoped>

</style>